import { useIntersectionObserver } from '@vueuse/core'
export const lazyPlugin = {
  install(app) {
    // 自定义指令懒加载
    app.directive('img-lazy', {
      mounted(el, binding) {
        // el:指令绑定的那个元素 img
        // binding: 指令等于号后面绑定的表达式的值 url地址
        // console.log(binding.value);
        const { stop } = useIntersectionObserver(
          el,
          ([{ isIntersecting }]) => {
            console.log(isIntersecting);
            if (isIntersecting) {
              // 进入视口区域
              el.src = binding.value
              stop()

            }
          }
        )
      }

    }
    )
  }
}